<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title> </title>
		<style type="text/css">
			#a {
				background-color: black;
				height: 80px;
				width: 1500px;
			}

			ul img {
				height: 60px;
				vertical-align: middle;
				
			}
			ul li{
				list-style: none;
				/* 去除无序列表圆点 */
				 display: inline-block;
				 /* 使无序列表并列 */
				 color: white;
				 font-size: 16px;
				 padding: 10px;
				vertical-align: middle;
			}
		    .a{
			    background-color: gold;
				height: 20px;
				width: 70px;
				border-radius: 20px;
				text-align: center;
				background: rgba(0,0,0,5);
				/* 设置透明度 */
				 border:1px solid gold ;
				 
			}
			.b{
				background-color: #FFD700;
				height: 20px;
				width: 100px;
				border-radius: 20px;
				/* 设置锐角四周 */
				text-align: center;
				/* 文字居中 */
				color: beige;
			}
			a{
				text-decoration: none;
				color: #F5F5DC;
			}
			a:hover {
				color:royalblue;
			}
			
		</style>
	</head>
	<body>
		<div id="a">
			<ul>
				<li class="img"><img src="../img/logo.png" class="c">
				<li><a href="#">功能特权</a></li>

				<li><a href="#">游戏特权</a></li>

				<li><a href="">生活特权</a></li>

				<li><a href="">会员活动</a></li>

				<li><a href="">成长体系</a></li>

				<li><a href="">年费专区</a></li>

				<li><a href="">超级会员</a></li>
          <li class="a"><a href=""> 登录 </a></li>
			<li class="b"><a href="">开通超级会员</a>
			</ul>

		</div>
	</body>
</html>
